import * as React from "react"
import { useParams } from "react-router-dom"
import {
  message
} from "antd"
import { IUser } from "../../types"
import * as api from '../../services/api'
import User from '../../components/User/index'

interface Params {
  id: string
}

export default function CompanyUser() {
  const [data, setData] = React.useState<IUser[]>([])
  const [companyShortName, setCompanyShortName] = React.useState<string>('')
  const id = useParams<Params>().id
  const getData = async () => {
    const handle = message.loading('正在更新数据...', 0)
    const res = await api.companyUser(id)
    if (res.stat === 'OK') {
      setData(res.rows)
    }
    handle()
  }
  const setStatus = async (id: string) => {
    console.log(id)
  }

  const del = async (id: string) => {
    const res = await api.removeCompanyUser(id)
    if (res.stat === 'OK') {
      message.success('删除成功')
    }
  }
  React.useEffect(() => {
    const handle = message.loading('正在加载数据...', 0)
    const getData = async () => {
      if (id.length !== 0) {
        const res = await api.companyUser(id)
        const res2 = await api.company(id)
        if (res2.stat === 'OK') {
          setCompanyShortName(res2.result.companyShortName)
        }
        if (res.stat === 'OK') {
          setData(res.rows)
        }

      } else {
        const res = await api.allUser()
        if (res.stat === 'OK') {
          setData(res.rows)
        }
      }
      handle()
    }

    getData()
  }, [id])
  return (
    <User
      getData={getData}
      data={data}
      delete={del}
      setStatus={setStatus}
      companyShortName={companyShortName}
    ></User>)
}
